<template>
  <div class="dy-main EAccountChangeOverResult">
    <div class="dy-header">
      <x-header :right-options="{showMore: false}"  :left-options="{backText: '',preventGoBack: true}" @on-click-more="showMenus = true" @on-click-back="back">充值成功</x-header>
    </div>
    <div class="dy-body">
      <div class="succes1">
      <div class="img-box-success"></div>
      <div class="eaccount-buy-result">充值成功</div>
    </div>
    <div class="eaccount-buy-result">
      <div class="eaccount-buy-result-detail">
        <div><div class="result-item-left">充值金额</div><div class="result-item-right">{{eaccountData.money}}元</div></div>
        <div><div class="result-item-left">充值卡号</div><div class="result-item-right">{{eaccountData.cardNo}}</div></div>
      </div>
    </div>
    <div class="eaccount-result-button">
      <x-button class="subBtn" type="primary" action-type="button" @click.native="gotoHome">完成</x-button>
    </div>
    </div>
  </div>
</template>

<script>

export default {
  data () {
    return {
      eaccountData: {
        money: '500.00',
        cardNo: '4225876765456787987'
      }

    }
  },
  methods: {
    back () {
      this.$publicFun.goBack(this)
    },
    gotoHome: function () {
      this.$router.push({name: 'EAccountEnter'})
    }

  },
  created () {
    this.eaccountData.money = this.$route.query.money
    this.eaccountData.acctType = this.$route.query.acctType
    this.eaccountData.cardNo = this.$route.query.cardNo
  }
}
</script>

<style lang="less">
.EAccountChangeOverResult {
  .succes1 {
    .img-box-success{
      width: 1.08rem;
      height: 1.08rem;
      margin-top: .8rem;
      margin-bottom: .52rem;
      margin-left: 50%;
      transform: translateX(-50%);
      background: url(../../assets/img/Financial/FinancialBuyResultSuccess.png) no-repeat left top;
      background-size: 100% 100%;
    }
    .img-box-failed{
      width: 1.08rem;
      height: 1.08rem;
      margin-top:.8rem;
      margin-bottom: .52rem;
      margin-left: 50%;
      transform: translateX(-50%);
      background: url(../../assets/img/Financial/zunxiang.png) no-repeat left top;
      background-size: 100% 100%;
    }
  }
  .eaccount-buy-result{
    text-align: center;
    font-size: .3rem;
    .eaccount-buy-result-detail{
      font-size:.28rem;
      margin:.68rem .3rem 1.12rem .3rem;
      padding: 0.26rem .3rem;
      border-radius: .28rem;
      background: #fff;
    }
    .eaccount-buy-result-detail>div{
      padding: .14rem 0;
      .result-item-left{
        /* display:inline-block; */
        width:30%;
        float: left;
        color:rgba(153,153,153,1);
      }
      .result-item-right{
        display:inline-block;
        text-align: right;
        width:70%;
        color:rgba(51,51,51,1);
      }
    }
  }
  .eaccount-result-button{
    padding: .32rem .4rem;
  }
}
</style>
